<template>
	<view>
		<view class="maskLayer" v-if="maskLayerShow">
		</view>
		<view class="submitForm" v-if="submitFormShow">
			<text style="top: 10%;position: relative;">输入您的用户名</text>
			<view class="box" style="margin-top: 25%;">
			  <view class="cu-bar search" style="background-color: #F8F8F8;">
				<text>用户名:</text>  
			    <view class="search-form round">
			      <input type="text" placeholder="输入您的用户名" confirm-type="done" :value="inputValue" @input="getValue"></input>
			    </view>
			  </view> 	
			</view>
			<button class="cu-btn round line-green" style="position: relative;top: 10%;" @click="sendUsername">完成</button>	
		</view>
		<view v-for="(item,index) in data" :key="item.id">
		  <text>postId:{{item.postId}} userId:{{item.userId}} 标题:{{item.title}} 内容:{{item.content}} 时间:{{item.date}}</text>
		  <text class="cuIcon-delete" @click="Delete(index)"></text>
		</view>
		<view v-if="showCheck" style="text-align: center;">您还没有上传过文档</view>
		<view style="color: #007AFF;font-style: italic;font-weight: 800;text-align: center;margin-top: 20%;font-size: 10px;" @click="showChange">上传文档</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				data:[],
				showCheck:false,
				maskLayerShow:false,
				inputValue:'',
				submitFormShow:false
			}
		},
		methods: {
			Delete(index){
				uni.request({
					url: 'http://summer.codinglink.tech:65001/post/deletePosts',
					method: 'POST',
					data: {
						postId:this.data[index].postId
					},
					success: res => {
						uni.showToast({
							title:'修改成功'
						})
						this.$forceUpdate();
					},
					fail: () => {},
					complete: () => {}
				});
			},
			showChange(){
				this.maskLayerShow=true;
				this.submitFormShow=true;
			},
			getValue(e){
			    this.inputValue=e.detail.value;
			},
			uploadDocument(){
				var that=this;
				wx.chooseMessageFile({
				  count: 1,
				  type: 'all',
				  success (res) {
				    const tempFilePaths = res.tempFiles
                    console.log(tempFilePaths[0].path);
					uni.uploadFile({
					            url: 'http://rap2api.taobao.org/app/mock/286869/user/searchfile', 
					            filePath: tempFilePaths[0].path,
					            name: 'file',
					            success: (res) => {
					            }
					        });
					uni.request({
						url: 'http://rap2api.taobao.org/app/mock/286869/user/searchfile',
						method: 'GET',
						data: {filePath: tempFilePaths[0].name},
						success: () => {
							uni.showToast({
								title: "上传成功",
							});
							that.maskLayerShow=false;
							that.submitFormShow=false;
						},
						fail: () => {
							uni.showToast({
								title: "上传失败",
								icon: 'none'
							});
							that.maskLayerShow=false;
							that.submitFormShow=false;
						},
						complete: () => {}
					});					  
				  }
				})
			},
			sendUsername(){
				var that=this;
				uni.request({
					url: 'http://rap2api.taobao.org/app/mock/286869/user/searchfile',
					method: 'GET',
					data: {
						username:that.inputValue
					},	
					success: res => {
						that.uploadDocument();
					},
					fail: () => {
						uni.showToast({
							title:"提交失败",
							icon:none
						})
					},
					complete: () => {}
				});
			}
		},
		onLoad() {
				var that=this;
				uni.request({
					url: 'http://summer.codinglink.tech:65001/post/getAllPosts',
					method: 'GET',
					data: {},
					success: res => {
						that.data=res.data.data;
					},
					fail: () => {
						that.showCheck=true;
					},
					complete: () => {}
				});
			}
		}
</script>

<style>
.maskLayer{
	width: 100%;
	height: 100%;
	background-color: #C0C0C0;
	opacity: 0.6;
	z-index: 5;
	position: fixed;
	left: 0;
	top: 0;
}
.submitForm{
	width: 70%;
	height: 50%;
	background-color: #F8F8F8;
	opacity: 1;
	z-index: 10;
	position: absolute;
	left: 15%;
	top: 30%;
	text-align: center;
}
</style>
